<template>
	<div class="datetime">
        <div class="bd_w jcalendar_week" id="jcalendar_week"></div>
        <div class="pop_bd" id="pop">
            <div class="pop_con">
                <span class="pop_close" onclick="$('#pop').hide();">&times;</span>
                <h5>选择年份：</h5>
                <div class="flex_i control">
                    <button onclick="$(this).next().val(parseInt($(this).next().val())-1)"><</button>
                    <input class="flex_auto control_val" type="text" id="setyear" value="- -" />
                    <button onclick="$(this).prev().val(parseInt($(this).prev().val())+1)">></button>
                </div>
                <h5>选择周：</h5>
                <div class="flex_i control">
                    <button onclick="$(this).next().val(parseInt($(this).next().val())-1)"><</button>
                    <input class="flex_auto control_val" type="text" id="setweek" value="- -" />
                    <button onclick="$(this).prev().val(parseInt($(this).prev().val())+1)">></button>
                </div>
                <div class="flex_i">
                    <button class="setjc_btn nowweek_btn flex_auto" onclick="tonowweek()">本周</button>
                    <button class="setjc_btn flex_auto" onclick="jumpweek()">确定</button>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
	import '../assets/jcalendar-week.css';
	import '../assets/jcalendar-week.js';
	export default{
		name: "datetime",
		data: function(){
			return {
				dateCN:'',
				date:[]
			}
		},
		props:["keys"],
		watch:{
			dateCN:function(v){
				this.getData()
			}
		},
		mounted:function(){
			const that = this;
			var weekfn = new window.jcalendar_week({
	            element: "#jcalendar_week",//填充日历的dom元素
	            dayaddclass: function (date) {
	                //添加某天时给添加类名
	                return "";
	            },
	            dayclick: function (date, obj) {
	            	console.log(date, obj)
	            	date = date.split('-');
	            	let dateCN = date[1]+"月"+date[2]+"日";
	            	that.$set(that, "dateCN", dateCN);
	            	date = [date[0],(parseInt(date[1])<10?"0"+date[1]:date[1]),(parseInt(date[2])<10?"0"+date[2]:date[2])];
	            	that.$set(that, "date", date);
	                //day点击事件
	                $(obj).addClass("calendar_day_act").siblings().removeClass("calendar_day_act");
	            }
	        });
	        //跳转到指定周
	        window.jumpweek =function () {
	            var getyear = parseInt($("#setyear").val());
	            var getweek = parseInt($("#setweek").val());
	            weekfn.confirmweek(getyear, getweek);
	            $('#pop').hide();
	        }
	        //跳转到本周
	        window.tonowweek = function () {
	            weekfn.nowweek();
	            $('#pop').hide();
	        }
		},
		methods:{
			getData(){
				this.$emit("getGroupsList", this.$data.dateCN+" "+this.$props.keys.join(' '), this.$data.date, "feedsData")
			}
		}
	}
</script>
<style lang="less">
	@base:23.44/1rem;
	.datetime{
		margin:0 auto 10/@base auto;
	}
</style>